<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文档的基本组成</title>


    <link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Sonsie+One" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=ZCOOL+KuaiLe" rel="stylesheet">
</head>

<body>


    <header>

        <h1>程序亦非猿</h1>
    </header>

    <nav>

        <ul>

            <li><a href="#"> 主页</a></li>
        </ul>
        <form>
            <!-- 搜索栏是站点内导航的一个非线性的方式。 -->
            <input type="search" name="q" placeholder="要搜索的内容">
            <input type="submit" value="搜索">
        </form>
    </nav>



    <main>
        <!-- 网页主体内容 -->
        <article>
            <!-- 此处包含一个 article（一篇文章），内容略…… -->
        </article>
    
        <aside>
            <!-- 侧边栏在主内容右侧 -->
            <h2>相关链接</h2>
            <ul>
                <li><a href="#">这是一个超链接</a></li>
                <!-- 侧边栏有n个超链接，略略略…… -->
            </ul>
        </aside>
    </main>
    
    <footer>
        <!-- 本站所有网页的统一页脚 -->
        <p>© 2050 某某保留所有权利</p>
    </footer>

</body>

</html>